<?= $this->m_config->pesan(); ?>
<style type="text/css">
	table.main-table > tbody > tr:hover {
		background: #aaa!important;
		color:#fff;
	}
</style>
<div class="card">
	<div class="card-content">
		<div class="card-title">
			Daftar Berkas
			<a href="<?= base_url("admin/dokumen/tambah"); ?>" class="btn  pull-right">tambah dokumen baru</a>
		</div>
		<p class="table-responsive">
			<table class="table striped main-table" style="width: 100%">
				<thead>
					<tr>
						<th>
							Tanggal
						</th>
						<th>
							Judul
						</th>
						<th>
							Mapel
						</th>
						<th>
							Pembuat
						</th>
						<th>
							Keterangan
						</th>
                        <!-- <th>#</th> -->
					</tr>
				</thead>
			</table>
		</p>
	</div>
</div>
<script type="text/javascript">
	var table = $(".table").DataTable({
		"ajax": "<?= base_url('admin/dokumen/json_list'); ?>",
        "columns": [
            { "data": "created_at" },
            { "data": "judul" },
            { "data": "XNamaMapel" },
            { "data": "pembuat" },
            { "data": "keterangan" },
            // { "data": "edit" },
        ],
        "order": [[1, 'asc']]
	});

	$('.table tbody').on('click', 'td', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );
 
        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child( format(row.data()) ).show();
            console.log(row.data());
            tr.addClass('shown');
        }
    } );

function format ( d ) {
    // `d` is the original data object for the row
    let ht = '<div style="padding-left:10%"><table class="table bordered black-text">'+
        '<thead> <tr> <th> Berkas </th> <th>#</th> </tr>  </thead> <tbody>';
        file = JSON.parse(d.file);
        for (var i = 0; i < file.length; i++) {
            ht += "<tr><td>" +file[i]+ "</td> <td> <a target='_blank' class='btn green' href='<?= base_url(); ?>/asset/uploads/dokumen/" + file[i] + "'> <i class='material-icons'>cloud_download</i></a></td></tr>";
        }
    ht +='</tbody></table></div>';

    return ht;
}
</script>